zm.ready(function() {
    
    
    
    zm(".add-item").click(function() {
        zm(".question").find("input").each(function() {
            zm(this).val("");
        });

        setElement("question", getQuestionForm());
        AddQuestionEvent();
        zm(".question").show();
    });
    zm("#save").click(function() {
        // find title and decription form

        var title = zm('.header-form input').val();
        var descripton = zm('.header-form textarea').val();
        var share = zm(".share").attr("checked");
        var start = zm('#date-start').val().split("/");
        var end = zm('#date-end').val().split("/");
        var sday = start[0];
        var smonth = start[1];
        var syear = start[2];
        var eday = end[0];
        var emonth = end[1];
        var eyear = end[2];
        var point = zm('#point').val();
        var beginDate = new Date();
        beginDate.setDate(sday);
        beginDate.setMonth(smonth - 1);
        beginDate.setFullYear(syear);
        var endDate = new Date();
        endDate.setDate(eday);
        endDate.setMonth(emonth - 1);
        endDate.setFullYear(eyear);
        var benginDay = parseInt(beginDate.getTime() / 1000);
        var endDay = parseInt(endDate.getTime() / 1000);
        var survey = new Survey(title, descripton, benginDay, endDay, point, share);
        // find question form
        var index = 1;
        zm('.question-answer').each(function() {

            var title = zm(this).find('.question-title').text();
            var helpText = zm(this).find('.question-helptext').text();
            var type = zm(this).find('.answer').attr("typeanswer");
            var require = zm(this).find('.require').attr("requirement");

            var question = new Question(index, title, helpText, type, require);
            if (type === singleselection || type === multichoice) {

                zm(this).find('.answer .answer-option').each(function() {
                    var opption = zm(this).find('span').text();
                    console.log(opption);
                    question.addChoices(opption);
                });
            }
            survey.addToQuestions(question);
            index++;
        });
        var error = checkSurvey(survey);
        if (error !== "") {
            showPopupSmall("Lỗi nhập liệu", error);
            return;
        }
        var JSONSurvey = zm.serialize(survey);
        ajaxAddSurvey(JSONSurvey);

    });
});

function AddQuestionEvent(){
      // select combobox event
    zm("#choice-answer").change(function() {
        var type = zm(this).val();
        if (type === singleline) {
            zm(".content-answer").html(getText());
        }
        if (type === multiline) {
            zm(".content-answer").html(getParagraph());
        }
        if (type === singleselection || type === multichoice) {
            zm(".content-answer").html(getMultiChoice());
            // and event for button add
            zm(".add-option").bind("click", function() {
                zm(".add-option").before(getChoice());
                //removeButton();
                zm(".remove").unbindAll();
                zm(".remove").bind("click", function() {
                    zm(this).parent().remove();
                });
            });
        }
    });
    
    // done question
    zm(".done-question").bind("click", function() {
        if (!isEdit) {
            zm(".form-question").append(addquestion());
            isEdit = false;
        }
        else {

            parent.html(addeditedquestion());
            parent.removeClass("isedit");
            isEdit = false;
            
        }
      
        // raise delete question event
        zm('.remove-answer').unbindAll();
        zm('.remove-answer').bind("click", function() {           
            zm(this).parent().parent().remove();
             var i=1;
               zm(".form-question").find(".question-answer").each(function(){
                    zm(this).find(".question-span").text("Câu " + i +": ");
                    i++;
                });
            
        });

        // raise edit question event
        zm('.edit-answer').unbindAll();
        zm('.edit-answer').bind("click", function() {
            console.log("run");
            isEdit = true;
            parent = zm(this).parent().parent();
            parent.addClass("isedit");
            editquestion();
        });
        zm(".question").remove();

    });

}

   function addquestion() {
        zm(".form-question").addClass("boder-style");
        var require = zm('input[name="require"]').attr("checked");
        var title = zm('input[name="title"]').attr("value");
        var help = zm('input[name="help-text"]').attr("value");
        var type = zm('#choice-answer').val();
        var num = zm(".form-question").find(".question-answer").length + 1;
        var question = '<div class="question-answer" >';

        question += '<div class="edit non-display"><button class="remove-answer remove-" >Xóa</button>';

        question += '<button class="edit-answer remove-" >Sửa</button></div><span class="question-span">Câu ' + num + ':</span><span class="question-title">' + title + "</span>";
        if (require === true) {
            question += '<span  class="require" requirement=true>(*)</span>';
        }
        else {
            question += '<span class="require" requirement=false></span>';
        }

        question += '<p class="question-helptext">' + help + '</p>';
        if (type === singleline) {
            question += '<div class="answer" typeanswer="' + singleline + '">';

            question += '<input type="text" size="50"/>';
        }
        if (type === multiline) {
            question += '<div class="answer" typeanswer="' + multiline + '">';
            question += '<textarea cols="50" ></textarea>';

        }
        if (type === multichoice) {
            question += '<div class="answer" typeanswer="' + multichoice + '">';
            zm(".option").each(function() {
                var txt = zm(this).find('input[type="text"]').val();
                question += '  <div class="answer-option">'
                        + '<input type="checkbox" ><span>' + txt + '</span>'
                        + '</div>';
            });
        }
        if (type === singleselection) {
            question += '<div class="answer" typeanswer="' + singleselection + '">';
            var name = radioName++;
            zm(".option").each(function() {
                var txt = zm(this).find('input[type="text"]').val();
                question += '<div class="answer-option" >'
                        + '<input type="radio" name="' + name.toString() + '"><span>' + txt + '</span>'
                        + '</div>';
            });

        }
        question += '</div>';
        question += '</div>';
        return question;

    }

    function addeditedquestion() {
        zm(".form-question").addClass("boder-style");
        var require = zm('input[name="require"]').attr("checked");
        var title = zm('input[name="title"]').attr("value");
        var help = zm('input[name="help-text"]').attr("value");
        var type = zm('#choice-answer').val();
        var num = parent.find(".question-span").text();
        var question = '';

        question += '<div class="edit non-display "><button class="remove-answer remove-" >Xóa</button>';

        question += '<button class="edit-answer remove-" >Sửa</button></div><span class="question-span">' + num + '</span><span class="question-title">' + title + "</span>";
        if (require === true) {
            question += '<span  class="require" requirement=true>(*)</span>';
        }
        else {
            question += '<span class="require" requirement=false></span>';
        }

        question += '<p class="question-helptext">' + help + '</p>';
        if (type === singleline) {
            question += '<div class="answer" typeanswer="' + singleline + '">';

            question += '<input type="text" size="50"/>';
        }
        if (type === multiline) {
            question += '<div class="answer" typeanswer="' + multiline + '">';
            question += '<textarea cols="50" ></textarea>';

        }
        if (type === multichoice) {
            question += '<div class="answer" typeanswer="' + multichoice + '">';
            zm(".option").each(function() {
                var txt = zm(this).find('input[type="text"]').val();
                question += '  <div class="answer-option">'
                        + '<input type="checkbox" ><span>' + txt + '</span>'
                        + '</div>';
            });
        }
        if (type === singleselection) {
            question += '<div class="answer" typeanswer="' + singleselection + '">';
            var name = radioName++;
            zm(".option").each(function() {
                var txt = zm(this).find('input[type="text"]').val();
                question += '<div class="answer-option" >'
                        + '<input type="radio" name="' + name.toString() + '"><span>' + txt + '</span>'
                        + '</div>';
            });


        }
        question += '</div>';
        return question;

    }

    function showeditquestion(title, help, type, require, value) {

        setElement("question", getQuestionForm());
        AddQuestionEvent();
        var temp = false;
        if(require==="true")
            temp=true;
        zm('input[name="require"]').attr("checked", temp);
        zm('input[name="title"]').attr("value", title);
        zm('input[name="help-text"]').attr("value", help);
        var temp = "";
        zm('#choice-answer').val(type);
        for (var i = 0; i < value.length; i++) {
            temp += '<div class="option"><input type="radio" name="0" disabled=""><input type="text" size="50" value="' + value[i] + '"/><button class="remove">Xóa</button><br></div>';
        }
        if (type === singleselection || type === multichoice) {
            temp += '<button class="add-option button-zm1">Thêm</button>';
        }

        zm(".content-answer").html(temp);
        // and event for button add
        zm(".add-option").bind("click", function() {
            zm(".add-option").before(getChoice());
            //removeButton();
            zm(".remove").unbindAll();
            zm(".remove").bind("click", function() {
                zm(this).parent().remove();               
                //removeButton();
            });

        });

        zm(".remove").unbindAll();
        zm(".remove").bind("click", function() {
            zm(this).parent().remove();
            //removeButton();
        });
        zm(".question").show();
    }

    function editquestion() {

        var title = parent.find(".question-title").text();
        var help = parent.find(".question-helptext").text();
        var type = parent.find(".answer").attr("typeanswer");
        var require = parent.find(".require").attr("requirement");
        var value = new Array();
        var i = 0;
        parent.find(".answer-option").each(function() {
            var temp = zm(this).find("span").text();
            value[i++] = temp;
        });
        showeditquestion(title, help, type, require, value);
    }
    
 function removeButton() {
    var size = zm(".content-answer").children().size();
    if (size === 2) {
        zm(".remove").addClass("hide");
    }
    else {
        zm(".remove").removeClass("hide");
    }
}

 